<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>注册网易云免费邮箱-中国第一大电子邮件服务商</title>
    <link rel="shortcut icon" href="images/favicon.ico">
    <link rel="stylesheet" type="text/css" href="css/main.css">
    <style type="text/css">
    </style>
</head>
<body>
    <header class="header">
        <div class="bg"></div>
        <div class="links">
           <a href="#">了解更多|</a>
           <a href="#">反馈意见</a>
        </div>
     
    </header>

    <section class="content">
       <header>
          <h1 class="content-tit">
            欢迎注册无限容量的网易邮箱！邮件地址可以登录使用其他网易旗下产品。
          </h1>

       </header>
      <div class="main-wrapper">
   <!--左边表单区域-->
       <div class="mainBody">
          <div class="regTabs">

        <ul>
          <li><a href="#">注册字母邮箱</a></li>
          <li><a href="#">注册字母邮箱</a></li>
          <li><a href="#">注册字母邮箱</a></li>
        </ul>
      </div>
          
     
       <div class="regForm">
        <dl class="regForm-item">
           <dt class="regForm-title">
              <span class="txt-imp">*</span>邮件地址</dt>

             <dd class="regForm-ct">
                 <input type="text" class="ipt" style="width:200px;"> 
                 <strong style="font-weight: block;font-size:14px;"></strong>
                <span>@</span>
             <select>
            <option selected="selected">163.com</option>
            </select>

        <div class="ipt-tip">
               <span>
                  6~19个字符，可使用字母，数字、下划线。需与字母开头</>
                </span>
              </div>
            </dd>
         </dl>

         <dl class="regForm-item">
            <dt class="regForm-title">
                 <span class="txt-imp">*</span>密码</dt>

            <dd class="regForm-ct">
                <input class="ipt" type="text" name="" style="width:322px;">

                  <div class="ipt-tip">
                 <span> 6~16个字符，区分大小写</span>
              </div>
            </dd>
         </dl>
         <dl class="regForm-item">
         <dt class="regForm-title">
           <span class="txt-imp">*</span>确认密码</dt>

            <dd class="regForm-ct">
               <input class="ipt" type="text" name="">

                 <div class="ipt-tip">
                    <span>请再次填写密码</span>
                 </div>
            </dd>
         </dl>
         <dl class="regForm-item"></dl>
         <dt class="regForm-title">
             <span class="txt-imp">*</span>手机号码</dt>

         <dd class="regForm-ct">
            <!--输入文本框-->
            <input id="phone" class="ipt" type="text" value="+86" style="width:322px font-size14px;font-weight:bold;padding-left:40px;">
            <!--国旗图标与下拉箭头-->
            <div class="itl" style="width:35px; height:27px; line-height:27px">
                <div class="flag flag-CN">
                  <em>&nbsp;</em>
                </div>
            </div>
                <!--下拉列表选项-->

                <div class="select_panel">
                  <a herf="#" class="flag-CN">
                  <em></em>
                  中国+86
                  </a>
                  <a herf="#" class="flag-AL">
                  <em>阿尔巴尼亚(Shqipëria) +355</em>
                  </a>
                </div>
                <!--输入提示-->
            <div class="ipt-tip">
              <span>忘记密码时，可以通过该手机号码快速找回密码</span>
            </div>
         </dd>
         </dl>

         <dl class="regForm-item">
           <dt class="regForm-title">
              <span class="txt-imp">*</span>验证码</dt>




           <dd class="regForm-ct">
             <input class="ipt" type="text" name="" style="width:196px; vertical-align:top; margin-top:6px;">
                  <a id="vcodeA" href="javascript:void(0);" class="switchvCode" tabindex="-1"><!-- 看不清楚？换张图片 --></a>

                 

             <div class="ipt-tip">
               <span>请填写图片中的字符，不区分大小写</span>
             </div>


          <div class="btns">
          <a type="btn" >
             <button>免费换取验证码</button>
          </a>
          </div>
      </dd>
    </dl>


    <dl class="regForm-item">
      <dt class="regForm-title">
        <span class="txt-imp">*</span>短信验证码</dt>
          <dd class="regForm-ct">
            <input class="ipt" type="text" style="width:322px;">
             

             <div class="ipt-tip">
                <span>请查收手机短信，并填写短信中的验证码</span>
             </div>
          </dd>
     </dl>

     <dl class="regForm-item">
        <dt class="regForm-title"></dt>
          <dd class="regForm-ct">
            <button class="regBtn">立即注册</button>
          </dd>
     </dl>
    </div>

   <!--右边的广告区域-->
    <div class="maginBody-side">
       <img src="images/reg_master.gif">
    </div>

   </section>
   <script type="text/javascript">
   


          function select_flag(){
            var links=document.querySelectorAll(".select_panel a");
            for(i=0;i<links.length;i++){
              links[i].addEventListener("click",function(e){
                var target=e.target;
                var cls=target.className;
                var txt=target.innerText;

                var phone=txt.substr(txt.indexOf("+"),txt.length-txt.indexOf("+"));

                document.getElementById('phone').setAttribute('value',phone);
              })
              }
            };
          select_flag();

   </script>
</body>
</html>